<template>
        <div class="down" >
           <div @click="gets(index)" class="one1" v-for="(item,index) in list" :key="index" :class="{active:currentIndex==index}">{{item.datas}}</div>
        </div>
</template>

<script>
export default {
name:'down',
data(){
    return{
        currentIndex:0,
        list:[
            {datas:'首页'},
            {datas:'爆爆团'},
            {datas:'订单'},
            {datas:'我的'},
        ]
        
    }
},methods:{
    gets(index){
        this.currentIndex=index
    }
}
}
</script>

<style scoped>
.down{
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: space-around;
    line-height: 50px;
    background-color: white;
   
}
.down.active{
    color:red;
}
</style>